{% extends '_admin.html' %}
{% import 'public.html' as public %}



{% block modals %}
{{ super() }}
<!--时租收费-->
<div class="modal fade" id="CashHourlyPayModal">
    <div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
        <h4 class="modal-title">時租收費</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
        </div>
        <div class="modal-body">
            <form>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">車牌號碼：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">時租票號：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">車型結果：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center" readonly value="私家車">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">入場時間：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center" readonly value="2021/5/12 12:12:12">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center"><h2>泊車時長：<strong class="text-primary">7小時15分</strong></h2></label>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center"><h1>收費金額：<strong class="text-danger">100</strong> MOP</h1></label>
                </div>
            </form>
            <div class="text-center">
                <img src="{{ url_for('static', filename='images/default/vehicle.jpg')}}" 
                class="img-thumbnail" style="height: 360px;">
            </div>
        </div>
        <div class="modal-footer justify-content-center">
        <button type="button" class="btn btn-primary">收費</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        </div>
    </div>
    <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>

<!--失票处理-->
<div class="modal fade" id="CashTicketFixModal">
    <div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
        <h4 class="modal-title">時租失票處理</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
        </div>
        <div class="modal-body">
            <form>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">車牌號碼：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">時租票號：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">車型結果：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center" readonly value="私家車">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">入場時間：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control text-center" readonly value="2021/5/12 12:12:12">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center"><h2>泊車時長：<strong class="text-primary">7小時15分</strong></h2></label>
                </div>
            </form>
            <div class="text-center">
                <img src="{{ url_for('static', filename='images/default/vehicle.jpg')}}" 
                class="img-thumbnail" style="height: 360px;">
            </div>
        </div>
        <div class="modal-footer justify-content-center">
        <button type="button" class="btn btn-primary">補失票</button>
        <button type="button" class="btn btn-warning">補全票</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        </div>
    </div>
    <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>

<!--月租续费-->
<div class="modal fade" id="CashMonthlyPayModal">
    <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
        <div class="modal-header">
        <h4 class="modal-title">月租續費</h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
        </div>
        <div class="modal-body">
            <form>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">月租卡號：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control text-center">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">車牌號碼：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control text-center" readonly>
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">月租車型：</label>
                    <div class="col-sm-9">
                        <select class="form-control">
                            <option>電單車</option>
                            <option>私家車</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">租戶名稱：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control text-center" readonly>
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">聯係電話：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control text-center" readonly>
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">生效時間：</label>
                    <div class="col-sm-9">
                        <input type="text" class="form-control text-center" id="MonthlyDateValid">
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label class="col-form-label text-center">月租類型：</label>
                    <div class="col-sm-9">
                        <select class="form-control">
                            <option>普通月租</option>
                            <option>專用月租</option>
                            <option>員工月租</option>
                            <option>管理員</option>
                        </select>
                    </div>
                </div>
                <div class="form-group row justify-content-center">
                    <label><h1>月租費用：<strong class="text-danger">1000</strong> MOP</h1></label>
                </div>
            </form>
        </div>
        <div class="modal-footer justify-content-center">
            <button type="button" class="btn btn-primary">續費</button>
            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
        </div>
    </div>
    <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
{% endblock %}


{% block scripts %}
{{ super() }}
<script>
    // 日期时间选择初始化
    $('#MonthlyDateValid').daterangepicker({
          timePicker:true,
          timePicker24Hour:true,
          autoUpdateInput:false,
          drops:'up',
          locale: {cancelLabel:'Clear',format:'YYYY/MM/DD HH:mm:ss'}
        });
      // 设置时间范围
      $('#MonthlyDateValid').on('apply.daterangepicker', function(ev, picker) {
        $('#MonthlyDateValid').val(picker.startDate.format('YYYY/MM/DD HH:mm:ss') +' - '+ picker.endDate.format('YYYY/MM/DD HH:mm:ss'))
        //   UserManager.FilterForm.LoginTime = picker.startDate.format('YYYY/MM/DD HH:mm:ss') +' - '+ picker.endDate.format('YYYY/MM/DD HH:mm:ss')
        });
      // 清空时间
      $('#MonthlyDateValid').on('cancel.daterangepicker', function(ev, picker) {$('#MonthlyDateValid').val('')});
</script>
{% endblock %}


